<template>
	<view class="nft_container_bg">
		<z-paging ref="paging" v-model="dataList" @query="queryList" empty-view-img="../../static/img/nullData.png"
			empty-view-text="暂无数据">
			<!-- 头部搜索 -->
			<view class="headerbox">
				<u-search placeholder="请输入关键字" @search="toSearch"></u-search>
			</view>
			<!--轮播-->
			<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000" :circular="true">
				<swiper-item v-for="item in swiperList" :key="item.index">
					<view class="swiper-item">
						<image class="banner-img" :src="item"></image>
					</view>
				</swiper-item>
			</swiper>
			<!-- 分段器 -->
			<u-tabs :list="tablist" @click="changeTab" :inactiveStyle="{color: '#999'}"
				:activeStyle="{color: 'var(--echo-main-color)'}" lineColor="var(--echo-main-color)"></u-tabs>
			<!-- 切换的内容 -->
			<view class="dao_lists_card">
				<dao-card v-for="(item, index) in dataList" :item="item" @linkTo="toDaoDetail(item.serialNo)"
					:key="item.serialNo"></dao-card>
			</view>
		</z-paging>
		<!-- 拖拽小图标 -->
		<drag-animation></drag-animation>
	</view>
</template>
<script>

	var wx = require('../../node_modules/jweixin-module/lib/index.js');

	import {
		getDaoList,
		getDictItemPageList,
		getWechatSign
	} from '@/config/daoApi.js';
	export default {
		data() {
			return {
				// 数据列表
				dataList: [],
				// 轮播
				swiperList: [
					"../../static/img/lunbo1.png",
					"../../static/img/lunbo2.png",
					"../../static/img/lunbo3.png"
				],
				// 分段器
				tablist: [],
				// 分段器标志每一项
				tabItemType: '0'
			};
		},
		created() {

			// 模拟测试
			var userinfo = {
				'customerNo':"1538450455120711680",
				'walletAddress':"cfxtest:aap0nkdfm1ma1mcmxpp9u9462up7n24u7uzz4vpdsu",
				'walletPrivateKey': ""
			}
			var customerTokenInfo = {
				balance: "100000"
			}
			var customerNo = "1538450455120711680";
			uni.setStorageSync('userinfo',userinfo)
			uni.setStorageSync('customerNo',customerNo)
			uni.setStorageSync('customerTokenInfo',customerTokenInfo)

			getDictItemPageList({
				dictType: 'dao-type'
			}).then(res => {
				if (res) {
					console.log(res)
					this.tablist = res.data.map(item => {
						return {
							type: item.itemValue,
							name: item.label
						}
					})
				}
			})
		},
		onLoad(){
			// 向后台获取签名参数
			console.log(wx)
			getWechatSign({
					url: window.location.href
				}).then(res => {

				wx.config({
					...res.data,
					jsApiList: ["updateAppMessageShareData", "updateTimelineShareData"]
				});

				wx.checkJsApi({
					jsApiList: ["updateAppMessageShareData", "updateTimelineShareData"],
					success: function (res) {
						console.log('检查', res)
					}
				});

				wx.ready(function(){
					wx.updateAppMessageShareData({
						title: 's11e-DAO',
						desc: '一个围绕conflux公链生态建设，致力于推进bsin-paas及其生态应用开发的DAO',
						link: 'http://h5.huoyuanshequ.com/#/',
						imgUrl: 'http://www.huoyuanshequ.com/logo.png',
						success: function () {
							// 设置成功
						console.log("分享成功返回的信息为:", res);
							//this.$Message.message("设置成功!");
						}
					});
					wx.updateTimelineShareData({
						title: 's11e-DAO web3.0的施工队',
						link: 'http://h5.huoyuanshequ.com/#/',
						imgUrl: 'http://www.huoyuanshequ.com/logo.png',
						success: function () {
							// 设置成功
						console.log("分享成功返回的信息为:", res);
							//this.$Message.message("设置成功!");
						}
					})
				});
			})
		},
		onReady(){

		},

		methods: {
			queryList(pageNo, pageSize) {
				getDaoList({
					pageNo,
					pageSize,
					type: this.tabItemType
				}).then(res => {
					console.log('dao列表', res)
					this.$refs.paging.completeByTotal(res.data, res.pagination.totalSize);
				})
			},
			// 搜索
			toSearch() {
				console.log("搜索")
			},
			// tab切换
			changeTab(item) {
				// console.log('item', item.type);
				this.tabItemType = item.type
				console.log(this.tabItemType)
				this.$refs.paging.reload();
			},
			// dao详情
			toDaoDetail(serialNo) {
				uni.navigateTo({
					url: "/pages/home/daoDetail?serialNo=" + serialNo
				})
			},
			shareFriend() {
				console.log("shareFriend")
				WeixinJSBridge.invoke('sendAppMessage',options, function(res) {
					//_report('send_msg', res.err_msg);
				})
			},
			shareTimeline() {
				console.log("shareTimeline")
				WeixinJSBridge.invoke('shareTimeline',options, function(res) {
					//_report('timeline', res.err_msg);
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.nft_container_bg {

		.headerbox {
			padding: 20rpx;
		}

		.swiper-item,
		.banner-img {
			width: 100%;
			height: 100%;
		}
	}

	.dao_lists_card {
		margin: 30rpx 30rpx;
	}
</style>
